window.addEventListener("load", function () {
  // 初始化轮播
  var mySwiper = new Swiper('.swiper', {
    loop: true, // 循环模式选项
    // 如果需要分页器
    pagination: {
      el: '.swiper-pagination',
    },

    // 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
    //autoplay:true,//自动切换
    autoplay: {
      delay: 1000,//1秒切换一次
    },

  })


  //api的交互效果
  /* 
  需求确定:
  移入到li标签切换图片地址
  
  实现步骤:
  1.先获取li标签  (获取到的是一个集合)
  2.给li标签绑定移入事件
  3.在移入事件里面切换图片地址
  // 多了一个 -c  图片地址
  */

  let lis = this.document.querySelectorAll(".api .api-center li")
  console.log(lis);//  集合
  // 因为lis是一个集合  需要分别绑定移入事件 那就需要遍历 拿到每一个li标签
  lis.forEach(function (v, i) {
    // v 代表 元素
    // i 代表 索引
    // 分别给每一个li标签绑定移入事件
    v.addEventListener("mouseenter", function () {
      console.log(v.children[0].src, "这是原来的");
      // 字符串替换.replace("换走的","换进来的")
      v.children[0].src = v.children[0].src.replace(".svg", "-c.svg")
      // console.log(v.children[0].src.replace(".svg","-c.svg"),"这是换了地址之后的");
    })

    // 移出
    v.addEventListener("mouseleave", function () {
      //    将图片换成最开始的
      v.children[0].src = v.children[0].src.replace("-c.svg", ".svg")
    })
  })
  // 助力行业巨头
  let box1 = document.querySelectorAll('.api-1 .help .help-2 .help-3')
  console.log(box1);
  let box = 0
  this.setInterval(function () {
    box1[box].classList.remove('on')
    box++
    if (box == 3) {
      box = 0
    }
    box1[box].classList.add('on')

  }, 1000)
  // 回到顶部
  let btns = this.document.querySelector('.btns')
  console.log(btns);
  // btns.addEventListener('click', () => {
  //   this.scrollTo(0, 0)
  // })
  // 窗口滚动事件
  // console.log(window.scrollY);
  // 控制返回顶部的显示和隐藏
  // let top = this.document.body.scrollHeight
  // btns.addEventListener('scroll', () => {
  //   if (top >= 500) {
  //     btns.style.display = "block"
  //   } else {
  //     btns.style.display = "none"

  //   }
  // })
  let timerId = null;
  btns.addEventListener("click", function () {
    let st = window.scrollY;//获取距离文档顶部的距离
    window.clearInterval(timerId);
    timerId = window.setInterval(function () {
      st -= 100;
      if (st <= 0) {
        st = 0;
        window.clearInterval(timerId)
      }
      window.scrollTo(0, st);

    }, 30)
  })
  window.addEventListener("scroll", function () {
    //3.在滚轴事件里面进行判断 (if)   scrollY  获取距离
    if (scrollY >= 300) {
      // 3.1如果滚动条的距离大于等于300  就显示回到顶部按钮
      btns.style.display = "block"
    } else {
      //3.2否则就隐藏回到顶部这个按钮
      btns.style.display = "none"
    }
  })
})
